{extend name="public/base"/}
{block name="style"}

{/block}

{block name="body"}
	<header class="ui-header">  
	    <div class="ui-icon-left">
	        <a href="javascript:history.back(-1)" class="ui-icon icon-back"></a>
	    </div>
	    <h1 class="ui-title">更多打赏</h1>
	    <div class="ui-icon-right">
	        <a href="javascript:;" class="ui-icon icon-menu"></a>
	    </div>
	    <!--导航-->
	    {block name="include"}{include file="public:dropnav" /}{/block}
	</header>
	<div class="weui-content">
		<div class="weui_panel">
			<ul class="dashang-list">
				
			</ul>
		</div>
	</div>

{/block}

{block name="script"}
	<script type="text/javascript" src="__PUBLIC__/novel/js/jquery.min.js"></script>
	<script type="text/javascript" src="__PUBLIC__/novel/js/common.js"></script>
	<script src="__PUBLIC__/novel/js/updown.js"></script>
	<script>
	$(function(){
		var bookid= {$bookid}
	//页数 
	    var page = 0;
	    // 每页展示10个
	    var size =10;
	    $('.weui_panel').dropload({
	        scrollArea : window,
	        autoLoad : true,//自动加载
			//上拉
	  		domDown : {
	            domClass   : 'dropload-down',
	            domRefresh : '<div class="dropload-refresh f15 "><i class="icon icon-20"></i>上拉加载更多</div>',
	            domLoad    : '<div class="dropload-load f15"><span class="weui-loading"></span>正在加载中...</div>',
	            domNoData  : '<div class="dropload-noData">没有更多数据了</div>'
	        },
			//加载更多
	        loadDownFn : function(me){
	         page++;
	         window.history.pushState(null, document.title, window.location.href);
	         var result = '';
	            $.ajax({
	                type: 'GET',
	                url:'{:url('/book/ajaxbonus')}?page='+page+'&bookid='+bookid,
	                dataType: 'json',
	                success: function(data){
						var arrLen = data.lists.length;
						console.log(arrLen);
	                    if(arrLen){
							for(var i = 0; i < arrLen; i++){
								result+='<li>'
									+'<div class="ds-avatar"><img src="'+data.lists[i].avatar+'"/></div>'
									+'<div class="ds-header">'
										+'<div class="ds-name">'+data.lists[i].name+'</div>'
										+'<div class="ds-time">'+data.lists[i].time+'</div>'
									+'</div>'
									+'<div class="ds-body">'
										+'赠送：<img src="'+data.lists[i].ico+'" alt="" />X1个礼物给作者'
									+'</div>'
								+'</li>';
							}
	                    // 如果没有数据
	                    }else{
	                        // 锁定
	                        me.lock();
	                        // 无数据
	                        me.noData();
	                    }
	
	                    // 为了测试，延迟1秒加载
	                    setTimeout(function(){
	                        $('.dashang-list').append(result);  
	                        
	                       // 
	                        // 每次数据加载完，必须重置
	                        me.resetload();
	                    },1000);
	                },
	                error: function(xhr, type){
	                    alert('Ajax error!');
	                    // 即使加载出错，也得重置
	                    me.resetload();
	                }
	            });
	        }
	    });
	});
	</script>
{/block}